<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Preference</title>
<script type="text/javascript" src="http://apis.daum.net/maps/maps2.js?apikey=fdedf555ead724e65234ad4eb1ccb6760c6a6f1a"></script>
<link rel="stylesheet" type="text/css" href="jquery/jquery.mobile-1.0a4.1.css" />
<script src="jquery/jquery-1.6.1.min.js"></script>
<script src="jquery/jquery.mobile-1.0a4.1.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
		navigator.geolocation.getCurrentPosition(function(pos) {
			var lat = pos.coords.latitude;
			var lng = pos.coords.longitude;
			
			var mapOption = {
				point: new DLatLng(lat, lng),
				level: 3,
				map_type: "TYPE_SKYVIEW"
			};
			map = new DMap(document.getElementById("map_canvas"), mapOption);
//			var zoomControl = new DZoomControl();
//			var indexMapControl = new DIndexMapControl();
//			map.addControl(zoomControl);
//			zoomControl.setVAlign("middle");
		});
	});
</script>
</head>
<body>
<div data-role="page" data-theme="b">
	<div data-role="header">
		<h1>Bus Arriving Info</h1>
	</div>
	<div data-role="content" data-theme="c">
		<div id="map_canvas"></div>
	</div>
	<div data-role="footer" data-theme="a">
		<div data-role="navbar">
			<ul>
				<li><a href="service_list.html" rel="external" data-icon="grid">Services</a></li>
				<li><a href="preference.html" rel="external" data-icon="gear">Preference</a></li>
			</ul>
		</div>
	</div>
</div>
</body>
</html>